// import { RainbowKitProvider } from '@rainbow-me/rainbowkit';
import 'babel-polyfill'
import { useAccount, useConnect, WagmiConfig } from 'wagmi';
// import { chains, wagmiClient } from '@/config/wagmi';
import { client } from '@/config/wagmi';
import type { AppProps } from 'next/app';
import { useEffect, useState } from 'react';
import '../styles/globals.css';
// import '../styles/rainbowkit.css';
import Header from '@/components/Header';
import { Provider } from 'react-redux'
import store from '@/store/store'

import '@/utils/i18n.js'
import { useTranslation } from 'react-i18next';
import { Suspense } from 'react';
import storage from '@/utils/storage';


function MyApp({ Component, pageProps }: AppProps) {

  const { t, i18n } = useTranslation();
  const lang = i18n.language === 'zh' ? 'zh-CN' : 'en'
  storage.localSet('lang', lang)

  const [mounted, setMounted] = useState(false);
  useEffect(() => {
    setMounted(true)
  }, []);
  if (!mounted) return null;

  return (
    <div>
      <Provider store={store}>
        <WagmiConfig client={client}>
          <Suspense fallback="loading">
            {/* <RainbowKitProvider chains={chains}>  */}
            <Header></Header>
            {/* 撑开header */}
            <div style={{ paddingTop: '70px' }}></div>
            <Component {...pageProps} />
            {/* </RainbowKitProvider> */}
          </Suspense>
        </WagmiConfig>
      </Provider>

    </div>
  );
}

export default MyApp;
